import { ElMessage } from 'element-plus'

export const copy = {
	mounted: function (el, { value }) {
		el.$value = value
		// el控件定义 onclick 事件
		el.onclick = () => {
			if (!el.$value) {
				ElMessage.closeAll()
				ElMessage.warning('无复制内容')
				return
			}
			// 动态创建 textarea 标签
			const textarea = document.createElement('textarea')
			textarea.style.position = 'absolute'
			;(textarea.style.left = '-9999px'),
				// 将要 copy 的值赋给 textarea 标签的 value 属性
				(textarea.value = el.$value)
			// 将 textarea 插入到 body 中
			document.body.appendChild(textarea)
			// 选中值并复制
			textarea.select()
			const result = document.execCommand('Copy')
			if (result) {
				ElMessage.closeAll()
				ElMessage.success('复制成功')
			}
			document.body.removeChild(textarea)
		}
		el.addEventListener('click', el.handler)
	},
	// 当传进来的值更新的时候触发
	beforeUpdate(el, { value }) {
		el.$value = value
	},
	// 指令与元素解绑的时候，移除事件绑定
	unmounted(el) {
		el.removeEventListener('click', el.handler)
	}
}

export default copy
